<template>
  <div class="center-energy-report">
    <dv-loading v-if="loading"></dv-loading>
    <KPIpreparation
      v-else
      :tableList="tableList"
      :tableTitles="tableTitles"
      :ActualBudgetList="ActualBudgetList"
      :RealityEnergyConsumptionData="RealityEnergyConsumptionData"
      @Checkyear="checkyear"
      @Selectmonth="selectmonth"
    />
  </div>
</template>
<script>
function getCurrentMonth() {
  var date = new Date();
  var yesterday_milliseconds = date.getTime() - 1000 * 60 * 60 * 24;
  var yesterday = new Date();
  yesterday.setTime(yesterday_milliseconds);

  var strYear = yesterday.getFullYear();
  var strDay = yesterday.getDate();
  var strMonth = yesterday.getMonth() + 1;
  if (strMonth < 10) {
    strMonth = "0" + strMonth;
    strDay = "0" + strDay;
  }
  return strMonth;
}
import KPIpreparation from "../../components/KPIpreparation/KPIpreparation.vue";
import {
  searchStatisticalConsumption,
  ActualBudget,
} from "../../api/base8090.js";
import { mapState } from "vuex";
export default {
  name: "kPIpreparation",
  components: {
    KPIpreparation,
  },
  created() {
    this.timer = setInterval(() => {
      if (document.readyState === "complete") {
        this.loading = false;
        window.clearInterval(this.timer);
      }
    }, 1000);
    this.initData();
  },
  data() {
    return {
      loading: true,
      timer: null,
      tableList: [],
      tableTitles: [],
      queryParmas: {
        stationCode: sessionStorage.getItem("stationCode"),
        years: new Date().getFullYear() + "",
      },
      queryActualBudgetParmas: {
        stationCode: sessionStorage.getItem("stationCode"),
        monthAnYear: new Date().getFullYear() + "-" + getCurrentMonth(),
      },
      ActualBudgetList: [],
      RealityEnergyConsumptionData: {},
    };
  },
  methods: {
    initData() {
      this.tableList = [];
      this.tableTitles = [];
      searchStatisticalConsumption(this.queryParmas)
        .then((res) => {
          if (res.code == 200) {
            this.tableTitles = res.data[0];
            let arr = res.data;
            arr.splice(0, 1);
            let item = [];
            arr.forEach((res) => {
              let newObject = {};
              res.forEach((item) => {
                newObject[item.tag] = item.value;
              });
              item.push(newObject);
            });
            this.tableList = item;
          }
        })
        .catch(() => {
          this.$message.error("响应超时，服务异常！");
        });

      ActualBudget(this.queryActualBudgetParmas)
        .then((res) => {
          if (res.code == 200) {
            this.ActualBudgetList =
              res.data.RealityBudgetEnergyConsumptionReportForm;
            this.RealityEnergyConsumptionData =
              res.data.RealityEnergyConsumptionProportion;
            sessionStorage.setItem(
              "ActualBudgetList",
              JSON.stringify(res.data.RealityBudgetEnergyConsumptionReportForm)
            );
            sessionStorage.setItem(
              "RealityEnergyConsumptionData",
              JSON.stringify(res.data.RealityEnergyConsumptionProportion)
            );
          }
        })
        .catch(() => {
          this.$message.error("响应超时，服务异常！");
        });
    },
    selectmonth(month) {
      this.queryActualBudgetParmas.monthAnYear =
        this.queryParmas.years + "-" + month;
      ActualBudget(this.queryActualBudgetParmas)
        .then((res) => {
          if (res.code == 200) {
            this.ActualBudgetList =
              res.data.RealityBudgetEnergyConsumptionReportForm;
            this.RealityEnergyConsumptionData =
              res.data.RealityEnergyConsumptionProportion;
          }
        })
        .catch(() => {
          this.$message.error("响应超时，服务异常！");
        });
    },
    checkyear(year) {
      this.queryParmas.years = year;
      this.queryActualBudgetParmas.monthAnYear = year + "-" + getCurrentMonth();
      this.initData();
    },
  },

  computed: {
    ...mapState(["stationCode"]),
  },
  watch: {
    stationCode(newVal, oldVal) {
      if (newVal != oldVal) {
        this.queryParmas.stationCode = newVal;
        this.queryActualBudgetParmas.stationCode = newVal;
        this.initData();
      }
    },
  },
};
</script>
<style lang="less" scoped>
.center-energy-report {
  width: 100%;
  height: 100%;
}
</style>
